<template>
	<div class="tit">
		<div class="list">
			<div class="li" @click="shouye">
				<img src="../assets/logo.png" />
				<!-- <span>帮帮同城</span> -->
			</div>
			<div class="rig">
				<!-- <div class="sousuo">
	        <input type="text" v-model="searchtext" @keyup.enter="search" placeholder="请输入区域小区名称开始找房" />
	        <p class="el-icon-search" @click="search"></p>
	      </div> -->
				<!-- <div class="but">下载帮帮同城app</div> -->
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: "titlesearch",
	data() {
		return {
			searchtext: '',
		}
	},
	methods: {
		shouye() {
			this.$router.push({
				path: '/'
			})
		},
		search() {
			this.openUrl({
				path: "/index/houseSearch",
				query: {
					search: this.searchtext,
				},
			});
		},
	}
}
</script>

<style lang="less" scoped>
.tit {
	width: 100%;
	height: 100px;
	background-color: #f2f2f2;

	.list {
		position: relative;
		width: 1200px;
		margin-left: 50%;
		padding-top: 25px;
		transform: translateX(-50%);
		background-color: #f2f2f2;

		div {
			display: inline-block;
			vertical-align: middle;
			font-size: 20px;
			color: #333333;
		}

		.li {
			cursor: pointer;
			font-size: 28px;
			color: #64b6a8;
			margin-right: 60px;

			img {
				/* width: 60px;
	        height: 60px; */
			}

			span {
				vertical-align: middle;
			}
		}

		.rig {
			position: absolute;
			right: 0;

			.sousuo {
				position: relative;
				display: block;
				width: 380px;
				height: 50px;
				background: #ffffff;
				border-radius: 4px;
				font-size: 18px;
				overflow: hidden;
				display: inline-block;

				input {
					width: 300px;
					height: 55px;
					line-height: 55px;
					text-indent: 16px;
					font-size: 18px;
				}

				img {
					width: 25px;
					height: 25px;
					margin-left: 20px;
					cursor: pointer;
				}

				p {
					position: absolute;
					top: 0;
					right: 0;
					width: 80px;
					height: 55px;
					background-color: #64b6a8;
					text-align: center;
					line-height: 55px;
					font-size: 24px;
					cursor: pointer;
					color: #ffffff;
				}
			}

			.but {
				width: 200px;
				height: 50px;
				background: #64b6a8;
				border-radius: 6px;
				text-align: center;
				line-height: 50px;
				color: #fff;
				margin-left: 30px;
			}
		}
	}
}</style>
